<template>
  <div class="spaceControl">
    <!-- 空间管理 -->
    <div class="consumerList">
      <div class="chooseContainer padding-box">
        <!-- <el-input placeholder="空间名称" v-model="searchKey.space_name" class="chooseBox"></el-input>
        
        <el-input placeholder="客户姓名" v-model="searchKey.user_name" class="chooseBox"></el-input>
        <el-input placeholder="客户电话" v-model="searchKey.user_tel" class="chooseBox"></el-input> -->
        <el-select v-model="searchKey.type" class="chooseBox" filterable placeholder="空间类型" clearable>
          <el-option v-for="item in searchKey.type" :key="item.value" :label="item.text" :value="item.value">
          </el-option>
        </el-select>
        <el-select v-model="searchKey.shooting_state" class="chooseBox" filterable placeholder="空间状态" clearable>
          <el-option v-for="item in searchKey.shooting_state" :key="item.value" :label="item.text" :value="item.value">
          </el-option>
        </el-select>
        <el-input placeholder="地域分布" v-model="searchKey.space_id" class="chooseBox"></el-input>
        <el-input placeholder="上架时间" v-model="searchKey.user_name" class="chooseBox"></el-input>
        <el-input placeholder="建筑时间" v-model="searchKey.user_name" class="chooseBox"></el-input>
        <!-- <el-select v-model="searchKey.status" class="chooseBox" filterable placeholder="付款状态" clearable>
          <el-option v-for="item in searchKey.status" :key="item.value" :label="item.text" :value="item.value">
          </el-option>
        </el-select> -->
        <!-- <el-select v-model="searchKey.des" class="chooseBox" filterable placeholder="金额包含项目" clearable>
          <el-option v-for="item in searchKey.des" :key="item.value" :label="item.text" :value="item.value">
          </el-option>
        </el-select> -->
        <!-- <el-select v-model="searchKey.option" class="chooseBox" filterable placeholder="时间" clearable>
          <el-option v-for="item in searchKey.option" :key="item.value" :label="item.text" :value="item.value">
          </el-option>
        </el-select> -->
        <!-- <div>注册时间
          <el-date-picker v-model="data" type="datetimerange" style="margin: 0px 16px" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期">
          </el-date-picker>
        </div> -->
        <!-- <div>
          <el-date-picker v-model="searchKey.data" type="datetimerange" style="margin: 0px 16px" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期">
          </el-date-picker>
        </div> -->
        <div class="btnBox">
          <el-button @click="addSpace">新增空间</el-button>
          <el-button type="primary" @click="searchBtn">搜索</el-button>
          <el-button @click="spaceClear">重置</el-button>
        </div>
      </div>
      <div class="padding-box">
        <el-table :data="orderData" style="width: 100%"  empty-text="没有搜索到相关空间">
          <el-table-column prop="order_num" label="空间编号" min-width="80">
          </el-table-column>
          <el-table-column prop="creat_time" label="空间名称" min-width="80">
          </el-table-column>
          <el-table-column prop="pay_time" label="地址" min-width="80">
          </el-table-column>
          <el-table-column prop="user_name" label="空间类型" min-width="80">
          </el-table-column>
          <el-table-column prop="user_tel" label="合作类型" min-width="80">
          </el-table-column>
          <el-table-column prop="space_name" label="状态" min-width="80">
          </el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button type="primary" @click="upAndLow(scope.row)" size="mini" v-if="flag==true">上架</el-button>
              <el-button type="primary" @click="upAndLow(scope.row)" size="mini" v-if="flag==false">下架</el-button>
              <el-button type="primary" @click="examine(scope.row)" size="mini">审核</el-button>
              <el-button type="text" @click="arrangeDate(scope.row)" size="mini">档期</el-button>
              <el-button type="text" @click="editSpace(scope.row)" size="mini">修改</el-button>
              <el-button type="text" @click="setupSpecial(scope.row)" size="mini">设置特价</el-button>
              <el-button type="text" @click="setRecommend(scope.row)" size="mini" v-if="tjflag==true">设为推荐</el-button>
              <el-button type="text" @click="setRecommend(scope.row)" size="mini" v-if="tjflag==false">移除推荐</el-button>
              <el-button type="text" @click="setMember(scope.row)" size="mini">设为会员</el-button>
              <el-button type="text" @click="seeDetail(scope.row)" size="mini">查看详情</el-button>
              <el-button type="text" size="mini" @click="deleteConsumer(scope.row)">收入情况</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="pageContainer">
          <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="this.pageSizeArray" :page-size="this.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="this.total">
          </el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
import { pageCommon } from '@/assets/js/mixin'
export default {
  name: 'spaceControl',
  mixins: [pageCommon],
  data() {
    return {
      flag: true,
      tjflag: true,
      btnText: '上架',
      searchKey: {
        type: [
          {
            text: '常规订单',
            value: 1
          },
          {
            text: '特价订单',
            value: 2
          }
        ],
        shooting_state: [
          {
            text: '未完成',
            value: 0
          },
          {
            text: '已完成',
            value: 1
          }
        ],
        status: [
          {
            text: '已下单未付款',
            value: 0
          },
          {
            text: '已付款成功',
            value: 1
          },
          {
            text: '订单完成',
            value: 2
          },
          {
            text: '取消订单',
            value: 3
          },
          {
            text: '取消订单退款成功',
            value: 4
          }
        ],
        option: [
          {
            text: '付款时间',
            value: 1
          },
          {
            text: '取景时间',
            value: 2
          }
        ]
      },
      orderData: [
        {
          order_num: 1111111111111111,
          creat_time: '2018/00/00',
          pay_time: '10/10/10',
          user_name: '张三',
          user_tel: 12311223231,
          space_name: '四大石窟',
          pay_money: 14447,
          shoot_money: 21313,
          room_money: 11414,
          repast_money: 1417,
          begin_time: '18/21/12',
          status: '确认',
          pay_type: '微信支付',
          store_state: '等待确认',
          shooting_state: '完成'
        },
        {
          order_num: 1111111111111111,
          creat_time: '2018/00/00',
          pay_time: '10/10/10',
          user_name: '张三',
          user_tel: 12311223231,
          space_name: '四大石窟',
          pay_money: 14447,
          shoot_money: 21313,
          room_money: 11414,
          repast_money: 1417,
          begin_time: '18/21/12',
          status: '确认',
          pay_type: '微信支付',
          store_state: '等待确认',
          shooting_state: '完成'
        },
        {
          order_num: 1111111111111111,
          creat_time: '2018/00/00',
          pay_time: '10/10/10',
          user_name: '张三',
          user_tel: 12311223231,
          space_name: '四大石窟',
          pay_money: 14447,
          shoot_money: 21313,
          room_money: 11414,
          repast_money: 1417,
          begin_time: '18/21/12',
          status: '确认',
          pay_type: '微信支付',
          store_state: '等待确认',
          shooting_state: '完成'
        }
      ]
    }
  },
  computed: {
    apiParams() {
      return {
        // pageSize: this.pageSize,
        // pageNo: this.pageNo,
        // name: this.name,
        // id: this.oneCategory
      }
    }
  },
  methods: {
    // 上下架
    upAndLow() {
      this.flag = !this.flag
      if (this.flag === true) {
      //
      } else if (this.flag === false) {
      //
      }
    },
    // 推荐
    setRecommend() {
      this.tjflag = !this.tjflag
    },
    addSpace() {
      this.$router.push({ name: 'spaceControl/addSpace' })
    },
    seeDetail() {
      this.$router.push({ name: 'spaceControl/spaceDetail' })
    },
    searchBtn() {
      // this.getList()
    },
    searchClear() { },
    exportOrder() { }
  }
}
</script>
<style lang="stylus" rel="stylesheet/stylus" scoped>
@import '../../../assets/stylus/variable'
.chooseContainer
  background $bg-normal
  overflow hidden
  display flex
  width 100%
  padding $spacing
  padding-bottom 20px
  flex-wrap wrap
  box-sizing border-box
  .chooseBox
    flex 0 0 224px
    margin-right $spacing
    margin-bottom $spacing
</style>
